<!--
    delegate-handle: 详见 $ionicSideMenuDelegate
    enable-menu-with-back-views: 设置为 false 时 menuToggle 按钮会隐藏且手势滑动展开 sideMenu 也会禁用而只保留返回按钮, 只有在 root 页面才会显示和启用 手势滑动展开 sideMenu, true 则会共存
-->
<ion-side-menus enable-menu-with-back-views="true">
    <!--
        side: left/right
        is-enabled: 是否启用 sideMenu
        width: sideMenu 的宽度, 默认 275
        expose-aside-when: large 表示 viewport 窗口的宽度 >=768px 时就 sideMenu 就展开且不会收起了. 若要自定义, 则可以填写 (min-width:600px) 或 (min-width:750px) and (max-width:1200px) 之类.
    -->
    <ion-side-menu side="left" expose-aside-when="large">
        <ion-header-bar class="bar-stable">
            <h1 class="title">菜单</h1>
            <!--
                menu-toggle: left/right, 打开/关闭 sideMenu
                menu-close: 关闭 sideMenu
            -->
            <button menu-close class="button button-icon ion-close-circled"></button>
        </ion-header-bar>
        <ion-content>
            <ion-list>
                <ion-item ng-repeat="item in ::menus" menu-close ui-sref="{{::item.name}}" ng-class="{active: item.label==viewTitle}">
                    {{::item.label}}
                </ion-item>
            </ion-list>
        </ion-content>
    </ion-side-menu>

    <!--
        drag-content: 是否可以拖动内容从未展开 sideMenu, 默认 true
        edge-drag-threshold: 拖动的范围. false/0 表示整个 conent 都可以通过拖动来展开 sideMenu, true 则只有 25px 的可拖动范围, number 指定可拖动范围.
    -->
    <ion-side-menu-content drag-content="true" edge-drag-threshold="100">
        <ion-nav-bar class="bar-positive">
            <ion-nav-back-button></ion-nav-back-button>

            <ion-nav-buttons side="left">
                <button class="button button-icon button-clear ion-navicon" menu-toggle="left"></button>
            </ion-nav-buttons>
        </ion-nav-bar>

        <ion-nav-view></ion-nav-view>
    </ion-side-menu-content>
</ion-side-menus>